package com.example.androidkotlinmvvm

import android.os.Bundle
import android.widget.Toast
import androidx.activity.ComponentActivity
import androidx.activity.compose.setContent
import androidx.activity.enableEdgeToEdge
import androidx.compose.foundation.BorderStroke
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.Row
import androidx.compose.foundation.layout.Spacer
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.verticalScroll
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.Info
import androidx.compose.material3.AlertDialog
import androidx.compose.material3.Button
import androidx.compose.material3.ButtonColors
import androidx.compose.material3.ButtonDefaults
import androidx.compose.material3.ButtonElevation
import androidx.compose.material3.Card
import androidx.compose.material3.CardColors
import androidx.compose.material3.CardDefaults
import androidx.compose.material3.Checkbox
import androidx.compose.material3.CheckboxDefaults
import androidx.compose.material3.HorizontalDivider
import androidx.compose.material3.Icon
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.RadioButton
import androidx.compose.material3.RadioButtonDefaults
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.material3.TextButton
import androidx.compose.material3.TextField
import androidx.compose.material3.TextFieldColors
import androidx.compose.material3.TextFieldDefaults
import androidx.compose.material3.VerticalDivider
import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf
import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.Shape
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.style.LineHeightStyle
import androidx.compose.ui.text.style.TextAlign
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.Constraints
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import androidx.compose.ui.window.Dialog
import androidx.constraintlayout.compose.ConstraintLayout
import androidx.constraintlayout.compose.Dimension
import coil.compose.rememberAsyncImagePainter
import com.bumptech.glide.integration.compose.ExperimentalGlideComposeApi
import com.bumptech.glide.integration.compose.GlideImage

class BaseLayoutActivity : ComponentActivity() {
    var text by mutableStateOf("")

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        enableEdgeToEdge()
        setContent {
            Scaffold(modifier = Modifier.fillMaxSize()) { innerPadding ->
                Column(
                    modifier = Modifier
                        .padding(innerPadding)
                        .fillMaxSize()
                        .verticalScroll(rememberScrollState()),
                    verticalArrangement = Arrangement.Top,
                    horizontalAlignment = Alignment.Start
                ) {
                    text()
                    HorizontalDivider(thickness = 2.dp, color = MaterialTheme.colorScheme.secondary)
                    button()
                    textField()
                    image()
                    checkbox()
                    radioButton()
                    box()
                    card()
                    constraintLayout()
                    dialog()
                    customerDialog()
                }
            }
        }
    }

    @Composable
    fun text() {
        Text(
            text = "Text:这个葛他放进口里看见萨法萨法甲联赛空间发生了快点放假啊是；打开房间阿斯利康独家发售；肯德基发牢骚；激发；是放假啊是风景啊是放假啊；设计方案；是的放假啊舒服",
            modifier = Modifier.padding(start = 10.dp, end = 10.dp, top = 10.dp, bottom = 10.dp),
            fontSize = 15.sp,
            fontWeight = FontWeight.Bold,
            maxLines = 1,
            textAlign = TextAlign.Left,
            overflow = TextOverflow.Ellipsis,
            color = Color.Red
        )
    }

    @Composable
    fun button() {
        Button(
            onClick = {
                Toast.makeText(this, "点击我了", Toast.LENGTH_LONG).show()
            },
            enabled = true,
            shape = RoundedCornerShape(10.dp),
            colors = ButtonDefaults.buttonColors(
                containerColor = Color.Blue,
                contentColor = Color.White
            ),
            modifier = Modifier.padding(10.dp),
            contentPadding = PaddingValues(start = 24.dp, end = 24.dp, top = 12.dp, bottom = 12.dp),
            elevation = ButtonDefaults.buttonElevation(defaultElevation = 10.dp),
            border = BorderStroke(1.dp, Color.Black)
        ) {
            Text(text = "Button")
        }
    }

    @Composable
    fun textField() {
        TextField(
            value = text,
            onValueChange = {
                text = it
            },
//            label = { Text("Single Line TextField") },
            placeholder = { Text("请输入你的标题", color = Color.Red) },
            shape = RoundedCornerShape(16.dp),
            textStyle = TextStyle(color = Color.Blue)
        )
    }

    @OptIn(ExperimentalGlideComposeApi::class)
    @Composable
    fun image() {
        Row(
            modifier = Modifier
                .width(500.dp)
                .height(200.dp),
            horizontalArrangement = Arrangement.Center,
            verticalAlignment = Alignment.CenterVertically
        ) {
            Image(
                painter = painterResource(id = R.drawable.ic_launcher_foreground),
                contentDescription = "",
                contentScale = ContentScale.FillBounds,
                modifier = Modifier
                    .width(200.dp)
                    .height(200.dp)
                    .background(Color.LightGray)
                    .padding(vertical = 8.dp)
            )
            // 从网络加载图像
            val networkPainter = rememberAsyncImagePainter(
                model = "https://picsum.photos/id/1025/800/600"
            )
            Spacer(modifier = Modifier.width(10.dp))
            VerticalDivider(thickness = 2.dp, color = MaterialTheme.colorScheme.secondary)

            Image(
                painter = networkPainter,
                contentDescription = "",
                contentScale = ContentScale.FillBounds,
                modifier = Modifier
                    .width(100.dp)
                    .height(100.dp)
                    .background(color = Color.LightGray)
                    .padding(vertical = 8.dp)
            )
            Spacer(modifier = Modifier.width(10.dp))
            VerticalDivider(thickness = 2.dp, color = MaterialTheme.colorScheme.secondary)

            GlideImage(
                model = "https://images.unsplash.com/photo-1519681393784-d120267933ba?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1770&q=80",
                contentDescription = "",
                modifier = Modifier
                    .width(200.dp)
                    .height(200.dp)
                    .background(Color.LightGray)
                    .padding(vertical = 8.dp),
                contentScale = ContentScale.Crop
            )
        }
    }

    @Composable
    fun checkbox() {
        var checked by remember { mutableStateOf(false) }
        Checkbox(
            checked = checked,
            onCheckedChange = { checked = it },
            enabled = true,
            colors = CheckboxDefaults.colors(
                checkedColor = Color.Green,
                uncheckedColor = Color.Red,
                checkmarkColor = Color.White
            ),
            modifier = Modifier.clip(MaterialTheme.shapes.medium)
        )
    }

    @Composable
    fun radioButton() {
        var selectedOption by remember { mutableStateOf("Option 1") }
        Row(modifier = Modifier.padding(vertical = 8.dp)) {
            RadioButton(
                selected = (selectedOption == "Option 1"),
                onClick = { selectedOption = "Option 1" },
                colors = RadioButtonDefaults.colors(
                    selectedColor = Color.Green,
                    unselectedColor = Color.Red
                ),
                modifier = Modifier.padding(end = 8.dp)
            )
            Text(text = "Option 1")
            RadioButton(
                selected = (selectedOption == "Option 2"),
                onClick = { selectedOption = "Option 2" },
                colors = RadioButtonDefaults.colors(
                    selectedColor = Color.Green,
                    unselectedColor = Color.Red
                ),
                modifier = Modifier.padding(end = 8.dp)
            )
            Text(text = "Option 2")
        }
    }

    @Composable
    fun box() {
        Box(
            modifier = Modifier
                .background(Color.Red)
                .width(200.dp)
                .height(200.dp)
                .padding(8.dp)
        ) {
            Text(text = "我是文字一")
            Text(text = "文字二")
            Icon(
                imageVector = Icons.Default.Info,
                contentDescription = "Info",
                tint = Color.White,
                modifier = Modifier.align(Alignment.Center)
            )
        }
    }

    @Composable
    fun card() {
        Card(
            modifier = Modifier
                .width(200.dp)
                .height(300.dp)
                .clickable { /* Handle click */ },
            shape = RoundedCornerShape(16.dp),
            colors = CardColors(
                containerColor = Color.Blue,
                contentColor = Color.White,
                disabledContainerColor = Color.White,
                disabledContentColor = Color.White,
            )
        ) {
            Column {
                Text(text = "324234234234234")
                Text(text = "234234234324")
                Text(text = "23423423423534")
                Text(text = "42342342343432342")
            }

        }
    }

    @Preview
    @Composable
    fun constraintLayout() {
        ConstraintLayout(
            modifier = Modifier
                .fillMaxSize()
                .height(400.dp)
                .background(color = Color.LightGray)
                .padding(16.dp)
        ) {
            //创建多个引用对象
            val (header, body, footer) = createRefs()
            // Header
            Text(
                text = "Header",
                fontSize = 24.sp,
                fontWeight = FontWeight.Bold,
                color = Color.Black,
                modifier = Modifier.constrainAs(header) {
                    top.linkTo(parent.top)
                    start.linkTo(parent.start)
                    end.linkTo(parent.end)
                    width = Dimension.fillToConstraints
                }
            )

            // Body
            Box(
                contentAlignment = Alignment.Center,
                modifier = Modifier
                    .constrainAs(body) {
                        top.linkTo(header.bottom, margin = 16.dp)
                        start.linkTo(parent.start)
                        end.linkTo(parent.end)
                        bottom.linkTo(footer.top, margin = 16.dp)
                        width = Dimension.fillToConstraints
                        height = Dimension.fillToConstraints
                    }
                    .background(Color.White)
                    .padding(16.dp)
            ) {
                Text(
                    text = "Body Content",
                    fontSize = 18.sp,
                    color = Color.Gray
                )
            }

            // Footer
            Button(
                onClick = { /* Handle click */ },
                modifier = Modifier.constrainAs(footer) {
                    bottom.linkTo(parent.bottom)
                    start.linkTo(parent.start)
                    end.linkTo(parent.end)
                    width = Dimension.fillToConstraints
                }
            ) {
                Text(text = "Footer Button")
            }
        }
    }

    @Composable
    fun dialog() {
        var showCustomDialog by remember { mutableStateOf(false) }
            Text(text = "点击弹框", modifier = Modifier.clickable {showCustomDialog=true}.height(100.dp))
        if (showCustomDialog) {
            AlertDialog(
                icon = {
//                Icon(icon, contentDescription = "Example Icon")
                },
                title = {
                    Text(text = "标题")
                },
                text = {
                    Text(text = "内容")
                },
                onDismissRequest = {
                    showCustomDialog = false
//                onDismissRequest()
                },
                confirmButton = {
                    TextButton(
                        onClick = {
                            showCustomDialog = false

//                        onConfirmation()
                        }
                    ) {
                        Text("确认")
                    }
                },
                dismissButton = {
                    TextButton(
                        onClick = {
                            showCustomDialog = false
//                        onDismissRequest()
                        }
                    ) {
                        Text("取消")
                    }
                }
            )
        }
    }


    @Composable
    fun customerDialog(){
        var showCustomDialog by remember { mutableStateOf(false) }
        Text(text = "点击自定义弹框", modifier = Modifier.clickable {showCustomDialog=true}.height(100.dp))
        if (showCustomDialog) {
            Dialog(onDismissRequest = { showCustomDialog = false }) {
                Column(
                    modifier = Modifier.padding(16.dp),
                    verticalArrangement = Arrangement.spacedBy(16.dp)
                ) {
                    Text("这是一个自定义对话框")
                    Button(onClick = { showCustomDialog = false }) {
                        Text("关闭对话框")
                    }
                }
            }
        }
    }
}